<template>
	<view class="pageblack recommend" :style="{width:'100%',height:windowHeight+'px'}">
		<u-toast ref="uToast" />
		<template v-if="vdshow">
			<!-- #ifdef MP-WEIXIN || MP-KUAISHOU -->
			<m-video class="mvideopage" ref="mvideo" :video-list="videoList" :startNumber="startNumber" :my_like_list="my_like_list" :showtype="1"
			:buy_episodes_list="buy_episodes_list" :objectFit="objectFit"
			@updateBuyList="updateBuyList" @expiresVideo="expiresVideoFn" @curInfo="curInfoFn">
				<!-- 此处为用户完全自定义 data 中的数据为当前渲染的数据 -->
				<!-- <template v-slot="{listitem}">
				  <text class="video-layer text-white position-absolute top-10 left-10" style="z-index: 999999;"> {{listitem.id}} </text>
				</template> -->
			</m-video>
			<!-- #endif -->
			<!-- #ifdef MP-TOUTIAO -->
			<dy-video class="mvideopage" ref="mvideo" :video-list="videoList" :startNumber="startNumber" :my_like_list="my_like_list" :showtype="1"
			:buy_episodes_list="buy_episodes_list" :objectFit="objectFit"
			@updateBuyList="updateBuyList" @curInfo="curInfoFn">
				<!-- 此处为用户完全自定义 data 中的数据为当前渲染的数据 -->
				<!-- <template v-slot="{listitem}">
				  <text class="video-layer text-white position-absolute top-10 left-10" style="z-index: 999999;"> {{listitem.id}} </text>
				</template> -->
			</dy-video>
			<!-- #endif -->
		</template>
		<view v-else-if="loading" class="d-flex a-center j-center"
			:style="{width:'100%',height:windowHeight+'px'}">
			<view class="d-flex flex-column loadingMain a-center j-center bg-black rounded30">
				<u-loading-icon mode="semicircle" vertical size="30" text="视频加载中" color="#FAA55D"></u-loading-icon>
			</view>
		</view>
		<view v-else class="d-flex a-center j-center" :style="{width:'100%',height:windowHeight+'px'}">
			<text class="d-flex text-light font-sm3">暂无视频</text>
		</view>
	</view>
</template>

<script>
	let that;
	import {mapState} from 'vuex';
	// #ifdef MP-WEIXIN || MP-KUAISHOU
	import mVideo from '@/components/mvideo/mvideo';
	// #endif
	// #ifdef MP-TOUTIAO
	import dyVideo from '@/components/mvideo/dyvideo';
	// #endif
	import config from "@/utils/config.js"
	import interfaces from '@/utils/interfaces.js';
	import tools from '@/utils/tools.js';
	export default {
		components: {
			// #ifdef MP-WEIXIN || MP-KUAISHOU
			mVideo,
			// #endif
			// #ifdef MP-TOUTIAO
			dyVideo,
			// #endif
		},
		data() {
			return {
				objectFit: 'contain', //contain：包含，fill：填充，cover：覆盖
				startNumber: 1,
				isShow: true,
				loading: true,
				videoCurInfo:{},//当前视频信息
				extraData: {},
				buy_episodes_list: [],
				my_like_list: [],
				sharevdoc: '', //当前是否有分享的VDOC
				pageindex: 0, //当前加载页码
				vdshow: false, //等数据加载好后再加载控件
				videoList: [], //播放列表
				newVideoList: [], //过期之后新的播放列表
				current_index: 0, // 这个参数可以控制从第几个视频开始播放（可以从onLoad动态修改这个参数）默认从0条开始
			};
		},
		computed: {
			...mapState({
				userInfo: state => state.user.userInfo,
				openid: state => state.user.openid,
				statusBarHeight: state => state.layout.statusBarHeight,
				windowWidth: state => state.layout.windowWidth,
				windowHeight: state => state.layout.windowHeight,
				videoPageHeight: state => state.layout.videoPageHeight,
				platform: state => state.layout.platform,
				xBarHeight: state => state.layout.xBarHeight //苹果手机安全区高度
			})
		},
		onShareAppMessage(res) {
			
			
		
				try{
					if(typeof this.videoCurInfo == 'object' && this.videoCurInfo!=null){
						console.log(this.videoCurInfo);
						console.log('/pages/videopage/videopage?pid=' + this.videoCurInfo.playlet_id+'&peid='+this.videoCurInfo.playlet_number);
						return {
							title: this.videoCurInfo.name+(this.videoCurInfo.playlet_number?('  第'+this.videoCurInfo.playlet_number+'集'):''),
							path: '/pages/videopage/videopage?pid=' + this.videoCurInfo.playlet_id+'&peid='+this.videoCurInfo.playlet_number
						}
					}
				}catch(e){
				}
			
			
			
		},
		onLoad() {
			that = this;
			this.onLoaded = true;
			this.$store.commit('mut_initLayout');
			this.check_video_objectFit();
			tools.get_user_info_by_serve(that, () => {});
			// 保持屏幕常亮
			uni.setKeepScreenOn({
				keepScreenOn: true
			});
			// #ifdef MP-TOUTIAO
			if (this.platform == 'ios') {
				//ios录屏
				tt.onUserScreenRecord((res) => {
					if (res.state === "start") {
						// 开始录屏
						that.isShow = false; //页面遮挡
						uni.showToast({title: "抱歉，禁止录屏",duration: 2000,icon: "none",mask:true});
					} else if (res.state === "stop") {
						// 取消录屏
						that.isShow = true; //页面不遮挡
					}
				});
			} else {
				//安卓禁止录屏
				tt.disableUserScreenRecord();
			}
			tt.onUserCaptureScreen((res) => {
				console.log('截屏', res)
				that.isShow = false; //页面遮挡
				uni.showToast({title: "抱歉，禁止截屏",duration: 2000,icon: "none",mask:true});
			});
			// #endif
			// #ifdef MP-WEIXIN || MP-KUAISHOU
			if (this.platform == 'ios') {
				//查询用户是否在录屏
				if (wx.getScreenRecordingState) {
					wx.getScreenRecordingState({
						success: res => {
							if (res.state != 'off') {
								that.isShow = false; //页面遮挡
								uni.showToast({title: "抱歉，禁止录屏",duration: 2000,icon: "none",mask:true});
							} else {
								that.isShow = true; //页面不遮挡
							}
						}
					})
				}
				// 监听用户录屏事件
				if (wx.onScreenRecordingStateChanged) {
					wx.onScreenRecordingStateChanged(res => {
						if (res.state == 'start') {
							that.isShow = false; //页面遮挡
							uni.showToast({title: "抱歉，禁止录屏",duration: 2000,icon: "none",mask:true});
						} else {
							that.isShow = true; //页面不遮挡
						}
					})
				}
			} else {
				wx.setVisualEffectOnCapture({
					visualEffect: 'hidden'
				});
			}
			// #endif
			tools.getRecommendListStatus(that,(res)=>{
				that._recommend_status_list = res.content
				console.log("getRecommendListStatus",that._recommend_status_list )
				that.getRecommend(); //获取数据
			})
		},
		onShow() {
			uni.setNavigationBarTitle({title: '推荐'});
			// #ifdef MP-TOUTIAO
			// if(this.$refs.mvideo){
			// 	if(this.$refs.mvideo.curStatusRes == this.$refs.mvideo.pause_res){
			// 		tools.getRecommendListStatus(that,(res)=>{
			// 			that._recommend_status_list = res.content
			// 			console.log("getRecommendListStatus",that._recommend_status_list )
			// 			that.getRecommend(); //获取数据
			// 		})
			// 	}
			// }
			// #endif
		},
		onHide() {
			console.warn('recommend  onHide');
			if(this.$refs.mvideo){
				this.$refs.mvideo.pauseVideo();
				this.$refs.mvideo.curStatusRes = this.$refs.mvideo.pause_res;
			}
		},
		destroyed(){
			console.warn('recommend  destroyed');
			// #ifdef MP-TOUTIAO
			tt.offUserCaptureScreen();
			tt.offUserScreenRecord();
			// #endif
			// #ifdef MP-WEIXIN || MP-KUAISHOU
			wx.offUserCaptureScreen();
			wx.offScreenRecordingStateChanged();
			// #endif
			this.vdshow = false;
		},
		methods: {
			check_video_objectFit() {
				try {
					if (this.windowWidth - (this.videoPageHeight - 50) * 0.5625 <= 50) {
						this.objectFit = 'fill';
					} else {
						this.objectFit = 'contain';
					}
				} catch (e) {}
			},
			curInfoFn(info){
				this.videoCurInfo = info;
			},
			jump_episodes(playlet_number) {
				console.warn('跳第' + playlet_number + '集');
				this.$refs.mvideo.scrollVideo(playlet_number, true);
			},
			expiresVideoFn(info) {
				console.log(info);
				console.warn('过期去请求最新剧集数据');
				if(typeof info == 'object' && info!=null){
					if(JSON.stringify(info)!='{}'){
						this.getRecommend();
					}
				}
			},
			getRecommend(){
				this.vdshow = false;
				this.loading = true;
				if(!this.openid){
					this.loading = false;
					this.$refs.uToast.show({
						title: '缺少openid，获取视频出错！',
						type: 'error',
						icon:false,
						duration:3000
					})
					return
				}
				that.request({
					url: interfaces.recommend,
					method: config.post,
					data: {
					},
					success: (res) => {
						// console.log('recommend',r)
						if (res.code === config.SUCCESS) {
							if(Array.isArray(res.content)){
								let episodeLen = res.content.length;
								console.log(260,res.content)
								if(episodeLen){
									let tempArray = [];
									for (let i = 0; i < episodeLen; i++) {
										if(typeof res.content[i].episodes_list == 'object' &&res.content[i].episodes_list!=null){
											// #ifdef MP-TOUTIAO
											if (res.content[i].episodes_list.album_id&&res.content[i].episodes_list.dy_episodes_id) {
											// #endif
											// #ifdef MP-WEIXIN || MP-KUAISHOU
											if (res.content[i].episodes_list.wx_original_url) {
												res.content[i].episodes_list['expiresTime'] = this.getTime(res.content[i].episodes_list.wx_original_url);
											// #endif
												res.content[i].episodes_list['id'] = i+1;
												// res.content[i].episodes_list['name'] = res.content[i].name||'';
												res.content[i].episodes_list['last_episode_number'] = episodeLen;
												tempArray.push(res.content[i].episodes_list)
											}
										}
									}
									console.log(tempArray);
									if(!tempArray.length){
										that.loading = false;
										this.vdshow = false;
										return;
									}
									that.videoList = tempArray;
									console.log(that.videoList); 
									console.log(that.userInfo);
									if(JSON.stringify(that.userInfo)!="{}"){
										that.vdshow = true; //数据加载到了再加载控件
										that.loading = false;
									}else{
										tools.get_user_info_by_serve(that,()=>{
											that.vdshow = true; //数据加载到了再加载控件
											that.loading = false;
										})
									}
								}
							}
						}
					}
				})
			},
			getTime(url) {
				if(url){
					// 使用正则表达式匹配t参数值
					let regex = /[?&]t=([^&]+)/,
						match = url.match(regex),
						timestamp;
					// 如果匹配成功，则将t参数值转换为时间戳
					if (match) {
						let tValue = match[1];
						timestamp = parseInt(tValue, 16) * 1000;
						return timestamp;
					} else {
						return '';
					}
				}else{
					return '';
				}
			}
		}
	};
</script>
<style lang="scss" scoped>
	.recommend{
		width: 100vw;
		height: 100vh;
	}
	.loadingMain{
		width: 220rpx;
		height: 200rpx;
	}
	/*  #ifdef  MP-WEIXIN  */
	.video-swiper {

		width: 100%;
		height: 100%;
	}

	/*  #endif  */
</style>
